<template>
    <div>
        <a-modal
            v-model:visible="visible"
            title="查看文件"
            @ok="handleOk"
            width="900px"
            wrapClassName="recitingDiscipline-full-modal"
            :footer="null"
            :dialogStyle="{top:'0'}"
        >
            <div v-if="currentData.clmc == '审核件'" >
                <div >
                    <div style="display: flex;justify-content: flex-end;margin-bottom: 5px;" >
                        <a-button style="margin-right: 20px;" class="orange-btn" type="primary" size="small"  v-print="printObj" icon="copy">打印</a-button>
                    </div>
                    <div style="height: calc(100vh - 118px);width: 100%;overflow: auto;display: flex;justify-content: center;" >
                        <div style="width: 794px;height: 100%;margin: 10px;" >
                            
                            <div class="viewFinalFile-documents-table-box" id="viewFinalFile-print-ID">
                                <div class="title-qymc-sxmc">
                                    {{currentData.sqsx && currentData.sqsx.fsxmc?currentData.sqsx.fsxmc:''}}技术审评审核件
                                </div>
                                <div class="title-pdbh" v-if="currentData.sqsx && currentData.sqsx.fyshbh">
                                    <span class="pdbh-left-text" >
                                        <span class="pdbh-title-text" >编号：</span>
                                        <span class="pdbh-right-text">
                                            {{ currentData.sqsx && currentData.sqsx.fyshbh?currentData.sqsx.fyshbh:'' }}
                                        </span>
                                    </span>
                                </div>
                                <table border bordercolor="#000" style="width: 100%;font-family: '楷体_GB2312' !important;" >
                                    <tr>
                                        <td class="th-text-box">申请单位</td>
                                        <td colspan="3">{{ currentData.sqsx && currentData.sqsx.fqymc?currentData.sqsx.fqymc:'' }}</td>
                                    </tr>
                                    <tr>
                                        <td class="th-text-box" >审评范围</td>
                                        <td colspan="3">{{ currentData.sqsx && currentData.sqsx.fcyjcfw?currentData.sqsx.fcyjcfw:'' }}</td>
                                    </tr>
                                    <tr>
                                        <td class="th-text-box">受理日期</td>
                                        <td>{{ currentData.sqsx && currentData.sqsx.fslsj?currentData.sqsx.fslsj:'' }}</td>
                                        <td class="th-text-box" style="width: 95px;" >受理编号</td>
                                        <td>{{ currentData.sqsx && currentData.sqsx.fslbh?currentData.sqsx.fslbh:'' }}</td>
                                    </tr>
                                    <tr>
                                        <td class="th-text-box">审评时间</td>
                                        <td colspan="3">{{ currentData.sqsx && currentData.sqsx.fcykssj?currentData.sqsx.fcykssj:'' }}&emsp;至&emsp;{{ currentData.sqsx && currentData.sqsx.fcyjssj?currentData.sqsx.fcyjssj:'' }}</td>
                                    </tr>
                                    <tr>
                                        <td class="th-text-box">
                                            <div>审</div>
                                            <div>查</div>
                                            <div>意</div>
                                            <div>见</div>
                                        </td>
                                        <td colspan="3" style="text-align: left;" >
                                            <div>
                                                <div>经审查：</div>
                                                <div style="white-space: pre-wrap;" v-html="currentData.sqsx && currentData.sqsx.fzhpdyj?currentData.sqsx.fzhpdyj:''" ></div>
                                                <div style="display: flex;justify-content: space-between;align-items: flex-start;margin: 8px 0;" >
                                                    <div>
                                                        <div style="display: flex;">
                                                            &emsp;&emsp;
                                                            <div>
                                                                <span>审查人：</span>
                                                                <img
                                                                v-if="currentData.scrQm && currentData.scrQm.qmpath"
                                                                :src="currentData.scrQm && currentData.scrQm.qmpath?currentData.scrQm.qmpath:''" 
                                                                alt="" style="height: 32px;">
                                                                <span v-else >{{ currentData.scrQm && currentData.scrQm.name?currentData.scrQm.name:'' }}</span>
                                                            </div>
                                                        </div>
                                                        <div style="margin-top: 3px;">
                                                            <span v-if="currentData.scrQm && currentData.scrQm.qmrq">
                                                                &emsp;&emsp;{{ currentData.scrQm.qmrq }}
                                                            </span>
                                                            <span v-else>&emsp;&emsp;&emsp;&emsp;年&emsp;&emsp;月&emsp;&emsp;日&emsp;&emsp;</span>
                                                        </div>
                                                    </div>
                                                    <div>
                                                        <div style="display: flex;" >
                                                            &emsp;&emsp;
                                                            <div style="display: flex;flex-wrap: wrap;align-items: center;" >
                                                                <span>复核人：</span>
                                                                <div v-for="(item,index) in currentData.fhrQmList" :key="index" style="padding: 2px;">
                                                                    <img
                                                                    v-if="item.qmpath"
                                                                    :src="item.qmpath" 
                                                                    alt=""
                                                                    style="height: 32px;"
                                                                    >
                                                                    <span v-else >{{ item.name }}</span>
                                                                </div>
                                                                
                                                            </div>
                                                        </div>
                                                        <div style="margin-top: 3px;">
                                                            <span v-if="currentData.fhrQmList && currentData.fhrQmList.length && currentData.fhrQmList[0].qmrq">
                                                                &emsp;&emsp;{{ currentData.fhrQmList[0].qmrq }}
                                                            </span>
                                                            <span v-else>&emsp;&emsp;&emsp;&emsp;年&emsp;&emsp;月&emsp;&emsp;日&emsp;&emsp;</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td class="th-text-box">科室负责人意见</td>
                                        <td colspan="3" style="text-align: left;">
                                            <div style="white-space: pre-wrap;" v-html="currentData.ksfzrQm && currentData.ksfzrQm.opinion?currentData.ksfzrQm.opinion:''" ></div>
                                            <div style="margin-top: 8px;display: flex;justify-content: space-between;align-items: center;">
                                                <div>
                                                    <span>签&emsp;名：</span>
                                                    <img
                                                        v-if="currentData.ksfzrQm && currentData.ksfzrQm.qmpath"
                                                        :src="currentData.ksfzrQm && currentData.ksfzrQm.qmpath?currentData.ksfzrQm.qmpath:''" 
                                                        alt="" style="height: 32px;">
                                                    <span v-else >{{ currentData.ksfzrQm && currentData.ksfzrQm.name?currentData.ksfzrQm.name:'' }}</span>
                                                </div>
                                                <div>
                                                    <span v-if="currentData.ksfzrQm && currentData.ksfzrQm.qmrq">
                                                        &emsp;&emsp;{{ currentData.ksfzrQm.qmrq }}
                                                    </span>
                                                    <span v-else>&emsp;&emsp;&emsp;&emsp;年&emsp;&emsp;月&emsp;&emsp;日&emsp;&emsp;</span>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td class="th-text-box">中心领导意见</td>
                                        <td colspan="3" style="text-align: left;">
                                            <div style="white-space: pre-wrap;" v-html="currentData.zxldQm && currentData.zxldQm.opinion?currentData.zxldQm.opinion:''" ></div>
                                            <div style="margin-top: 8px;display: flex;justify-content: space-between;align-items: center;">
                                                <div>
                                                    <span>签&emsp;名：</span>
                                                    <img
                                                        v-if="currentData.zxldQm && currentData.zxldQm.qmpath"
                                                        :src="currentData.zxldQm && currentData.zxldQm.qmpath?currentData.zxldQm.qmpath:''" 
                                                        alt="" style="height: 32px;">
                                                    <span v-else >{{ currentData.zxldQm && currentData.zxldQm.name?currentData.zxldQm.name:'' }}</span>
                                                </div>
                                                <div>
                                                    <span v-if="currentData.zxldQm && currentData.zxldQm.qmrq">
                                                        &emsp;&emsp;{{ currentData.zxldQm.qmrq }}
                                                    </span>
                                                    <span v-else>&emsp;&emsp;&emsp;&emsp;年&emsp;&emsp;月&emsp;&emsp;日&emsp;&emsp;</span>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div v-else >
                <a-spin tip="正在加载中..." :spinning="lastMeetingSpinning">
                    <div style="font-weight: 600;color: #5ca3e5;margin-bottom: 5px;" >{{ currentData.fwjxsmc+currentData.fwjlx }}</div>
                    <iframe 
                        v-if="programDataiframeSrc"
                        :key="iframeKey"
                        :src="programDataiframeSrc" 
                        ref="iframeServerEditingRef" 
                        scrolling="auto" 
                        width="100%"
                        :height="(windowInnerHeight - 115 )+'px'"
                        style="border: 0;"
                    ></iframe>
                    <div v-else style="height: calc(100vh - 118px);">
                        <a-empty description="暂无文件或文件发生错误！"/>
                    </div>
                </a-spin>
            </div>
            
        </a-modal>
    </div>
</template>
<script>
import { openFileReadOnly, } from './service/index'
import YchConstant from "@/api/YchConstant";
import blobType from '@/common/blobType'
export default {
    components:{

    },
    props:{

    },
    data(){
        return{
            iframeKey:null,
            programDataiframeSrc:'',
            windowInnerHeight:window.innerHeight,
            visible:false,
            currentData:{},
            lastMeetingSpinning:false,
            printObj:{
                id:"viewFinalFile-print-ID", //需要打印的id名称
                popTitle:"符合性审评审核件",//文档的名称
                // preview:true,//预览功能，不好用
                zIndex:'20002',
                beforeOpenCallback(vue){
                    //console.log('打印回调',vue)
                },
                openCallback (vue) {//打开之前
                    //console.log('打开之前',vue)
                },
                closeCallback (vue) {//关闭了打印工具
                    //console.log('关闭了打印工具')
                },
            },
        }
    },
    watch:{

    },
    mounted(){
        
    },
    methods:{
        getData(row){
            this.currentData = row
            if(row.clmc == '审核件'){
                this.currentData.sqsx.fzhpdyj = this.currentData.sqsx && this.currentData.sqsx.fzhpdyj?this.currentData.sqsx.fzhpdyj.replace(/ /g, '&emsp;'):''
                this.currentData.ksfzrQm.opinion = this.currentData.ksfzrQm && this.currentData.ksfzrQm.opinion?this.currentData.ksfzrQm.opinion.replace(/ /g, '&emsp;'):''
                this.currentData.zxldQm.opinion = this.currentData.zxldQm && this.currentData.zxldQm.opinion?this.currentData.zxldQm.opinion.replace(/ /g, '&emsp;'):''
            }else{
                this.lastMeetingSpinning = true
                if(row.fwjlx == '.doc' || row.fwjlx == '.docx'){
                    openFileReadOnly({id:row.id}).then(res=>{
                        if(res.code == 200){
                            //console.log('我一直在请求吗？',res.result.wordUrl)
                            this.programDataiframeSrc = res.result.wordUrl
                        }else{
                            this.programDataiframeSrc = ''
                        }
                        this.lastMeetingSpinning = false
                    })
                }else{
                    this.programDataiframeSrc = bootConfig[process.env.NODE_ENV].locality_ApI + YchConstant.SPZX_SPCY + '/spcyRsWjmb/openWjjl?id='+row.id
                    this.lastMeetingSpinning = false
                }
                this.iframeKey = Date.now()
            }
        },
        handleOk(){

        }
    }
}
</script>
<style lang="less">
.recitingDiscipline-full-modal{
    .ant-modal{
        padding: 0;
    }
    .ant-modal-body{
        padding: 8px
    }
}
.viewFinalFile-documents-table-box{
    .title-qymc-sxmc{
        text-align: center;
        font-family: 'SimSun' !important;
        font-size: 34px;
        font-weight: bold !important;
        padding: 6px;
        color: #000;
        border:1px dashed #d9d9d9;
        border-bottom: none;
    }
    .title-pdbh{
        border:1px dashed #d9d9d9;
        border-bottom: none;
        padding: 6px;
        text-align: right;
        .pdbh-title-text{
            font-size: 18px;
            font-weight: bold;
            font-family: '楷体_GB2312' !important;
        }
        .pdbh-right-text{
            text-align: center;
            color: #000;
            font-size: 16px;
        }
    }
    
    .th-text-box{
        font-size: 18px;
        // font-weight: 600;
        width: 55px;
        text-align: center;
        padding: 8px;
        font-family: '楷体_GB2312' !important;
        font-weight: bold;
        color: rgba(0, 0, 0, 0.65);
    }
    td{
        padding: 8px;
        text-align: center;
        font-size: 18px;
        font-family: '楷体_GB2312' !important;
        color: #000;
    }
}
@media print{
    #viewFinalFile-print-ID{
        .title-qymc-sxmc{
            text-align: center;
            font-family: 'SimSun' !important;
            font-size: 28px;
            font-weight: 600;
            padding: 6px;
            color: #000;
            border:1px dashed #d9d9d9;
            border-bottom: none;
        }
        .title-pdbh{
            border:1px dashed #d9d9d9;
            border-bottom: none;
            padding: 6px;
            text-align: right;
            .pdbh-title-text{
                font-size: 18px;
                font-weight: bold;
            }
            .pdbh-right-text{
                text-align: center;
                color: #000;
                font-size: 16px;
            }
        }
        
        .th-text-box{
            font-size: 18px;
            // font-weight: 600;
            width: 55px;
            text-align: center;
            padding: 8px;
            font-family: '楷体_GB2312' !important;
            font-weight: bold;
            color: rgba(0, 0, 0, 0.65);
        }
        td{
            padding: 8px;
            text-align: center;
            color: #000;
            font-size: 18px;
            font-family: '楷体_GB2312' !important;
        }
    }
}
</style>